<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<aside class="sidebar">
    <!-- 登录模板 start  -->
    <div id='_start'>
        <div id='_close' style="display: none;">
            <span class="glyphicon glyphicon-remove"></span>
        </div>
        <br />
        <!--登录框-->
        <div id="login_container">
            <div class="lab1">
                <span class="lab_login">登录</span>
                <span id="lab_toRegist">
				&emsp;还没有账号&nbsp;
				<span id='toRegist' style="color: #EB9316;cursor: pointer;">立即注册</span>
			</span>
            </div>
            <div style="width:330px;">
                <span id="lab_type1">手机号/账号登录</span>
            </div>
            <div id="form_container1">
                <br />
                <form  method="post" action="newsuser/login">
                    <input type="text" class="form-control" name="username" placeholder="用户名" id="login_number" required="required"/>
                    <input type="password" class="form-control" name="password" placeholder="密码" id="login_password" required="required"/>
                    <%--<input type="text" class="form-control" placeholder="验证码" id="login_vcode" />--%>

                    <input type="submit" value="登录" class="btn btn-success" id="login_btn" />
                </form>
                <span id="rememberOrfindPwd">
				<span>
					<input id="remember" type="checkbox" style="margin-bottom: -1.5px;">
				</span>
			    <span style="color:#000000">
					记住密码&emsp;&emsp;&emsp;&emsp;
				</span>
			    <span style="color:#000000">
                    <a>忘记密码</a>
				</span>
			</span>
            </div>

            <div style="display:block;width:330px;height:40px;">
                <span id="lab_type2">使用第三方直接登陆</span>
            </div>
            <div style="width:330px;height:100px;border-bottom: 1px solid #FFFFFF;">
                <br />
                <button id="login_QQ" type="button" class="btn btn-info">
                    <img src="/home/images/qq.png" style="width:20px;margin-top:-4px;" />&emsp;QQ登录
                </button>
                <button id="login_WB" type="button" class="btn btn-danger">
                    <img src="/home/images/sina.png" style="width:20px;margin-top:-4px;" />&emsp;微博登录
                </button>
            </div>
        </div>
        <!-- 会员注册 -->
        <div id='regist_container' style="display: none;">
            <div class="lab1">
                <span class="lab_login">注册</span>
                <span id="lab_toLogin">
				&emsp;已有账号&nbsp;
				<span id='toLogin' style="color: #EB9316;cursor: pointer;">立即登录</span>
			</span>
            </div>
            <div id="form_container2" style="padding-top: 25px;">
                <form method="post" action="newsuser/add" >
                    <input type="text" class="form-control" name="username"  placeholder="用户名" id="regist_username" required="required" />
                    <span id="checkNameInfo" class="checkInfo"></span>
                    <input type="password" class="form-control" name="password" placeholder="密码" id="regist_password1" required="required"/>
                    <input type="password" class="form-control" name="password1" placeholder="确认密码" id="regist_password2" required="required"/>
                    <span id="checkPwdInfo" class="checkInfo"></span>
                    <input type="text" class="form-control" name="name" placeholder="用户名" id="regist_name" required="required"/>
                    <input type="text" class="form-control" name="phone"  placeholder="手机号" id="regist_phone" required="required" pattern="^(0|86|17951)?(13[0-9]|15[012356789]|17[0678]|18[0-9]|14[57])[0-9]{8}"/>
                    <input type="email" class="form-control" name="email"  placeholder="邮箱" id="regist_email" required="required"/>
                    <input type="text" class="form-control" name="vcode" placeholder="验证码" id="regist_vcode" required="required" pattern="[0-9]{4}"/>
                    <!--<button id="getVCode" type="button" class="btn btn-success" >获取验证码</button>-->
                    <input id="getVCode" type="button" class="btn btn-success" value="发送邮箱验证码" onclick="sendCode(this)" />
                    <input type="submit" value="注册" class="btn btn-success" id="regist_btn"  disabled="disabled"/>
                </form>
            </div>
        </div>
    </div>
    <!-- 登录模板 end  -->

    <div class="fixed">
        <%--info hint--%>
        <div class="widget">
            <span style="color: red;text-align: center;display: block;font-weight: 700;">
                ${sessionScope.loginInfo}
                ${sessionScope.RegInfo}
            </span>
        </div>
        <div class="widget widget-tabs">
            <ul class="nav nav-tabs" role="tablist">
                <li role="presentation" class="active"><a href="#notice" aria-controls="notice" role="tab" data-toggle="tab">${sessionScope.about.desc}</a></li>
                <li role="presentation"><a href="#contact" aria-controls="notice" role="tab" data-toggle="tab">Info</a></li>
                <li role="presentation">
                    <a href="#RegLog" aria-controls="contact" role="tab" data-toggle="tab">
                        <c:if test="${sessionScope.newsuser.username != null}">
                            个人中心
                        </c:if>
                    </a>
                </li>
            </ul>
            <div class="tab-content">
                <div role="tabpanel" class="tab-pane contact active" id="notice" style="color: #023012cc;text-align: center;width: 100%;float: left">
                    <br>
                        <img src="/image/mine.jpg" class="mine">
                        <%--about--%>
                        <%--与你相遇 </br>
                        我就走进了一个循环 </br>
                        我把青春放进你的堆栈 </br>
                        取出的明天总是残缺不全 </br>

                        <span style="color: #60a5a5">不负天地，不负自己！</span>
                        <span style="float: right">___🐳🐳</span>
                        </br>--%>
                        ${sessionScope.about.name}
                        <span style="float: right">___gqzdev🐳🐳</span>
                    </p>
                </div>
                <div role="tabpanel" class="tab-pane contact" id="contact">
                    <h2>文章总数:<span id="total-article-span">123</span>篇</h2>
                    <h2>网站运行:<span id="sitetime">123 </span>天</h2>
                </div>
                <div role="tabpanel" class="tab-pane contact" id="RegLog">
                    <c:if test="${sessionScope.newsuser.username != null}">
                        <span class="personInfo">注册时间：<fmt:formatDate value="${sessionScope.newsuser.createtime}" pattern="yyyy-MM-dd HH:mm:ss"/></span>
                        <span class="personInfo">最近登录：<fmt:formatDate value="${sessionScope.newsuser.lasttime}" pattern="yyyy-MM-dd HH:mm:ss"/></span>
                    </c:if>
                </div>
            </div>
        </div>
        <div class="widget widget_search">
            <form class="navbar-form" action="/search_list" method="get">
                <div class="input-group">
                    <input type="text" name="keyword" class="form-control" size="35" placeholder="请输入关键字" maxlength="15"
                           autocomplete="off" value="${keyword }">
                    <span class="input-group-btn">
						<button class="btn btn-default btn-search" name="search" type="submit">搜索</button>
					</span>
				</div>
            </form>
        </div>
    </div>



    <div class="widget widget_hot">
        <h3>最新文章</h3>
        <ul id="last-news-list">

        </ul>
    </div>

    <div class="widget widget_hot">
        <h3>最新评论</h3>
        <ul id="last-comment-list">

        </ul>
    </div>

    <div class="widget widget_hot" style="display: none">
        <h3>评论最多文章</h3>
        <ul id="most-comment-list">

        </ul>
    </div>

    <%--广告栏位--%>
    <div class="widget widget_sentence">
        <h3>PICTURE</h3>
        <ul id="sidebar-ad-list">

        </ul>
    </div>

    <%--Tag--%>
    <div class="widget widget_sentence">
        <h3>Tag</h3>
        <div class="widget-sentence-tag">
            <ul id="sidebar-ad-tag">
                <li class="sidebar-tag">
                    <%--Stuggle for a better future！--%>
                    ${sessionScope.tag.name}
                </li>
            </ul>
        </div>
    </div>

    <div class="widget widget_sentence">
        <h3>友情链接</h3>
        <div class="widget-sentence-link">
            <ul id="sidebar-links-list">

            </ul>
        </div>
    </div>

    <div class="modal fade" tabindex="-1" role="dialog"
         id="deleteConfirm">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header wk-modal-header">
                    <button class="close" type="button" data-dismiss="modal">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4>ForFuture Group提示:</h4>
                </div>
                <div class="modal-body">您确定要退出？</div>
                <div class="modal-footer ">
                    <button id="deleteBtnOK" type="submit" class="btn btn-default btn-danger" data-dismiss="modal">确定</button>
                    <button type="button" class="btn btn-default"  data-dismiss="modal">取消</button>
                </div>
            </div>
        </div>
    </div>

</aside>

<script>
    $(document).ready(function() {
        //打开会员登录
        $("#Login_start_").click(function() {
            $("#regist_container").hide();
            $("#_close").show();
            $("#_start").animate({
                left: '350px',
                height: '457px',
                width: '360px'
            }, 400, function() {
                $("#login_container").show(400);
                $("#_close").animate({
                    height: '40px',
                    width: '40px'
                }, 400);
            });
        });
        //打开会员注册
        $("#Regist_start_").click(function() {
            $("#login_container").hide();
            $("#_close").show();
            $("#_start").animate({
                left: '350px',
                height: '540px',
                width: '360px'
            }, 500, function() {
                $("#regist_container").show(400);
                $("#_close").animate({
                    height: '40px',
                    width: '40px'
                }, 400);
            });
        });
        //关闭
        $("#_close").click(function() {
            $("#_close").animate({
                height: '0px',
                width: '0px'
            }, 500, function() {
                $("#_close").hide(400);
                $("#login_container").hide(400);
                $("#regist_container").hide(400);
                $("#_start").animate({
                    left: '0px',
                    height: '0px',
                    width: '0px'
                }, 400);
            });
        });
        //去 注册
        $("#toRegist").click(function(){
            $("#login_container").hide(400);
            $("#regist_container").show(400);
        });
        //去 登录
        $("#toLogin").click(function(){
            $("#regist_container").hide(400);
            $("#login_container").show(400);
        });
    });
    var clock = '';
    var nums = 120;  //60秒后重新发送验证码
    var btn;
    function sendCode(thisBtn) {
        var myReg=/^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|net|org)$/;
        var toemail = $("#regist_email").val();
        if (myReg.test(toemail)){
            btn = thisBtn;
            btn.disabled = true; //将按钮置为不可点击
            btn.value = '重新获取（' + nums + '）';
            clock = setInterval(doLoop, 1000); //一秒执行一次
            //发送邮箱验证码
            $.ajax({
                url: "newsuser/sendMail",
                data: {email: toemail},
                type: 'post',
                dataType: 'json',
                success: function (data) {
                    if (data.result == 'ok') {
                        alert("发送成功！去邮件查看验证码！！");
                        $("#checkNameInfo").html("");
                        $("#checkNameInfo").css({"display": "none"});
                        $("#regist_btn").attr("disabled", false);
                    } else {
                        alert("发送失败！");
                        $("#checkNameInfo").html(data.msg);
                        $("#checkNameInfo").css({"display": "block"});
                        $("#regist_btn").attr("disabled", true);
                    }
                }
            });
        }else {
            alert("邮件格式有问题！！");
            btn.disabled = true; //将按钮置为不可点击
            $("#regist_btn").attr("disabled",true);
        }
    }
    function doLoop() {
        nums--;
        if (nums > 0) {
            btn.value = '重新获取（'+nums+'）';
        } else {
            clearInterval(clock); //清除js定时器
            btn.disabled = false;
            btn.value = '发送邮箱验证码';
            nums = 120; //重置时间
        }
    }

    $(document).ready(function(){
        /*检验用户名*/
        $("#regist_username").blur(function () {
            var username = $("#regist_username").val();
            var reg=/^[\u4E00-\u9FA5A-Za-z0-9]{3,11}/;
            //alert(username);
            if (username == '' || username == 'undefined') {
                $("#regist_btn").attr("disabled",true);
            }else if(!reg.test(username)){
                $("#checkNameInfo").html("3-12位，由中文、数字、下划线和字母组成");
                $("#checkNameInfo").css({"display":"block"});
                $("#regist_btn").attr("disabled",true);
            }else{
                $("#checkNameInfo").html("");
                $("#checkNameInfo").css({"display":"none"});
                $("#regist_btn").attr("disabled",false);
                $.ajax({
                    url: "newsuser/checkName",
                    data: {username: username},
                    type: 'post',
                    dataType: 'json',
                    success: function (data) {
                        if (data.result == 'ok') {
                            $("#checkNameInfo").html("");
                            $("#checkNameInfo").css({"display":"none"});
                            $("#regist_username").css({"border":"none"});
                            $("#regist_btn").attr("disabled",false);
                        } else {
                            //alert(data.msg);
                            $("#checkNameInfo").html(data.msg);
                            $("#checkNameInfo").css({"display":"block"});
                            $("#regist_username").css({"border":"red 2px solid"});
                            $("#regist_btn").attr("disabled",true);
                        }
                    }
                });
            }
        });

        /* 确认密码 */
        $("#regist_password2").blur(function () {
            var password1 = $("#regist_password1").val();
            var password2 = $("#regist_password2").val();
            if(password1!=password2){
                $("#checkPwdInfo").html("两次密码不一致！！");
                $("#checkPwdInfo").css({"display":"block"});
                $("#regist_password2").css({"border":"red 2px solid"});
                $("#regist_btn").attr("disabled","disabled");
            }else {
                $("#checkPwdInfo").html("");
                $("#checkPwdInfo").css({"display":"none"});
                $("#regist_password2").css({"border":"none"});
                $("#regist_btn").attr("disabled",false);
            }
        });

        $("#regist_vcode").blur(function () {
            var vcode = $("#regist_vcode").val();
            if (vcode.length == 4){
                $.ajax({
                    url: "newsuser/checkMail",
                    data: {vcode: vcode},
                    type: 'post',
                    dataType: 'json',
                    success: function (data) {
                        if (data.result == 'ok') {
                            $("#regist_btn").attr("disabled",false);
                        } else {
                            alert(data.msg);
                            $("#regist_btn").attr("disabled",true);
                        }
                    }
                });
            }else {
                $("#regist_btn").attr("disabled",true);
            }
        });

        $("#login_QQ").click(function(){
            alert("暂停使用！");
        });
        $("#login_WB").click(function(){
            alert("暂停使用！");
        });

        $("#exit_btn").click(function(){
            $("#deleteConfirm").modal();
            $("#deleteBtnOK").on("click", function() {
                $.ajax({
                    url:'newsuser/exit',
                    dataType:'',
                    type:'post',
                    data:'',
                    success:function(data){
                        if(data.result == 'ok'){
                            alert('成功退出! ');
                            window.location.reload(true);
                        }else{
                            alert('操作失败！');
                        }
                    }
                });
            });
        });
    });

</script>


<script>
    function add0(m) {
        return m < 10 ? '0' + m : m
    }

    function format(shijianchuo) {
		//shijianchuo是整数，否则要parseInt转换
        var time = new Date(shijianchuo);
        var y = time.getFullYear();
        var m = time.getMonth() + 1;
        var d = time.getDate();
        var h = time.getHours();
        var mm = time.getMinutes();
        var s = time.getSeconds();
        return y + '-' + add0(m) + '-' + add0(d) + ' ' + add0(h) + ':' + add0(mm) + ':' + add0(s);
    }

    $(document).ready(function () {
        //最新文章排行
        $.ajax({
            url: '/last_news_list',
            type: 'post',
            dataType: 'json',
            success: function (data) {
                if (data.type == 'success') {
                    var newsList = data.newsList;
                    var html = '';
                    for (var i = 0; i < newsList.length; i++) {
                        if(newsList[i].photo==null){
                            var li = '<li><a title="' + newsList[i].title + '" href="/detail?id=' + newsList[i].id + '"  style="padding: 10px"><span class="text">' +'<i class="label">'+(i+1)+'.&nbsp;</i>'+ newsList[i].title + '</span><span class="muted"><i class="glyphicon glyphicon-time"></i>';
                            li += format(newsList[i].createTime) + '</span><span class="muted"><i class="glyphicon glyphicon-eye-open"></i>' + newsList[i].viewNumber + '</span></a></li>';
                            html += li;
                        }else{
                            var li = '<li><a title="' + newsList[i].title + '" href="/detail?id=' + newsList[i].id + '" ><span class="thumbnail">';
                            li += '<img class="thumb" data-original="' + newsList[i].photo + '" src="' + newsList[i].photo + '" alt="' + newsList[i].id + '"  style="display: block;">';
                            li += '</span><span class="text">'+'<i class="label">'+(i+1)+'.&nbsp;</i>' + newsList[i].title + '</span><span class="muted"><i class="glyphicon glyphicon-time"></i>';
                            li += format(newsList[i].createTime) + '</span><span class="muted"><i class="glyphicon glyphicon-eye-open"></i>' + newsList[i].viewNumber + '</span></a></li>';
                            html += li;
                        }
                    }
                    $("#last-news-list").append(html);
                }
            }
        });
        //最新评论排行
        $.ajax({
            url: '/last_comment_list',
            type: 'post',
            dataType: 'json',
            success: function (data) {
                if (data.type == 'success') {
                    var newsList = data.newsList;
                    var html = '';
                    for (var i = 0; i < newsList.length; i++) {
                        if(newsList[i].photo==null){
                            var li = '<li><a title="' + newsList[i].title + '" href="/detail?id=' + newsList[i].id + '"  style="padding: 10px"><span class="text">' +'<i class="label">'+(i+1)+'.&nbsp;</i>'+ newsList[i].title + '</span><span class="muted"><i class="glyphicon glyphicon-time"></i>';
                            li += format(newsList[i].createTime) + '</span><span class="muted"><i class="glyphicon glyphicon-eye-open"></i>' + newsList[i].viewNumber + '</span></a></li>';
                            html += li;
                        }else{
                            var li = '<li><a title="' + newsList[i].title + '" href="/detail?id=' + newsList[i].id + '" ><span class="thumbnail">';
                            li += '<img class="thumb" data-original="' + newsList[i].photo + '" src="' + newsList[i].photo + '" alt="' + newsList[i].id + '"  style="display: block;">';
                            li += '</span><span class="text">'+'<i class="label">'+(i+1)+'.&nbsp;</i>' + newsList[i].title + '</span><span class="muted"><i class="glyphicon glyphicon-time"></i>';
                            li += format(newsList[i].createTime) + '</span><span class="muted"><i class="glyphicon glyphicon-eye-open"></i>' + newsList[i].viewNumber + '</span></a></li>';
                            html += li;
                        }
                    }
                    $("#last-comment-list").append(html);
                }
            }
        });
        //评论数排行
        $.ajax({
            url: '/most_comment_list',
            type: 'post',
            dataType: 'json',
            success: function (data) {
                if (data.type == 'success') {
                    var newsList = data.newsList;
                    var html = '';
                    for (var i = 0; i < newsList.length; i++) {
                        if(newsList[i].photo==null){
                            var li = '<li><a title="' + newsList[i].title + '" href="/detail?id=' + newsList[i].id + '"  style="padding: 10px"><span class="text">' +'<i class="label">'+(i+1)+'.&nbsp;</i>'+ newsList[i].title + '</span><span class="muted"><i class="glyphicon glyphicon-time"></i>';
                            li += format(newsList[i].createTime) + '</span><span class="muted"><i class="glyphicon glyphicon-eye-open"></i>' + newsList[i].viewNumber + '</span></a></li>';
                            html += li;
                        }else{
                            var li = '<li><a title="' + newsList[i].title + '" href="/detail?id=' + newsList[i].id + '" ><span class="thumbnail">';
                            li += '<img class="thumb" data-original="' + newsList[i].photo + '" src="' + newsList[i].photo + '" alt="' + newsList[i].id + '"  style="display: block;">';
                            li += '</span><span class="text">'+'<i class="label">'+(i+1)+'.&nbsp;</i>' + newsList[i].title + '</span><span class="muted"><i class="glyphicon glyphicon-time"></i>';
                            li += format(newsList[i].createTime) + '</span><span class="muted"><i class="glyphicon glyphicon-eye-open"></i>' + newsList[i].viewNumber + '</span></a></li>';
                            html += li;
                        }
                    }
                    $("#most-comment-list").append(html);
                }
            }
        });
        $.ajax({
            url: '/get_site_info',
            type: 'post',
            dataType: 'json',
            success: function (data) {
                if (data.type == 'success') {
                    $("#total-article-span").text(data.totalArticle);
                    $("#sitetime").text(data.siteDays);
                }
            }
        });
        $.ajax({
            url: '/admin/ad/get_sidebar_ad',
            type: 'post',
            data: {"type":2,"size":4},
            dataType: 'json',
            success: function (data) {
                if (data.type == 'success') {
                    var adList = data.SidebarAdList;
                    for (var i = 0; i < adList.length; i++) {
                        var li = '<li><a title="'+adList[i].name+'" href="'+adList[i].link + '" class="sidebar-ad" target="_blank" rel="nofollow" ><img style="width: 100%" src="'+adList[i].path+'" alt="'+adList[i].name+'"/></a></li>';
                        $("#sidebar-ad-list").append(li);
                    }
                }
            }
        });
        // 获取links
        $.ajax({
            url: '/admin/ad/get_sidebar_ad',
            type: 'post',
            data: {"type":3,"size":10},
            dataType: 'json',
            success: function (data) {
                if (data.type == 'success') {
                    var adList = data.SidebarAdList;
                    var html='';
                    for (var i = 0; i < adList.length; i++) {
                        var li = '<li><a title="'+adList[i].name+'" href="'+adList[i].link + '" class="sidebar-links"  target="_blank" rel="nofollow" >'+adList[i].name+'</a></li>';
                        html += li;
                    }
                    $("#sidebar-links-list").append(html);
                }
            }
        });

    });
</script>

